<div id="content">
	<div class="row s_page_title">
		<sa-big-breadcrumbs [items]="['统计报表','订单统计']" icon="fa fa-bell-o" class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></sa-big-breadcrumbs>
	</div>
	<sa-widgets-grid>
		<div class="s_table">
			<div sa-widget [editbutton]="false" color="darken" class="clearfix">
				<header><span class="widget-icon"> <i class="fa fa-table"></i> </span><h2>订单统计</h2></header>
				<div>
					<div class="widget-body no-padding">
						<div class="page-header clearfix s_table_opreation">
							<div class="left page-header-btn">
								<div class="top_module">
									<span class="module_text">公司名称</span>
									<sa-company-tree companyTreeId="companyTree" [inputParam]="companyTreeParam" inputApi="orderFlowByOutsideCall/findCompanyDownList.html" (companySelected)="companySelected($event)"></sa-company-tree>                     
								</div>
								<div class="top_module">
									<span class="module_text">时间类型</span>
									<select class="module_inp" name="dateType" id="dateType" [(ngModel)]="dateType" (change)="dateChange()">
										<option value="1">按天汇总</option>
										<option value="2">按月汇总</option>  
										<option value="3">按年汇总</option>
									</select>
								</div>
								<div class="selectDate top_module">
									<div class="input-daterange input-group s_selected_time_box s_hover_box">
										<input type="text" [(ngModel)]='startTime' class="form-control s_selected_time" id="startTime"  autocomplete="off" placeholder="选择开始时间"/>
										<span class="s_selected_time_spe">至</span>
										<input type="text" [(ngModel)]='endTime' class="form-control s_selected_time" id="endTime"  autocomplete="off" placeholder="选择结束时间"/>
										<div class="s_del_icon" (click)='del_date()'>x</div>
									</div>
									
								</div>
								
								<button  type="button"  class="btn btn-primary" (click)="table_search()">查看</button>
							</div>
						</div>
						<div class="">
							<div class="echartContainer" style="display:flex;justify-content:space-around;position:relative;">
								<div class="left-echart" style="width:70%;height:500px;position: relative;">
									<div class="btn-group shortBox" style='border:1px solid #ccc;border-radius:4px;'>
										<button class="btn btn-link shortBtn" (click)="shortIcon('1')" [class.shortBtnActive]='shortBtnIndex == 1' type="button" style="margin:0;padding:0;height:28px;border-right:1px solid #ccc!important;border-radius:0!important;text-decoration: none;">10天</button>
										<button class="btn btn-link shortBtn" (click)="shortIcon('2')" [class.shortBtnActive]='shortBtnIndex == 2' type="button" style="margin:0;padding:0;height:28px;border-right:1px solid #ccc!important;border-radius:0!important;text-decoration: none;">20天</button>
										<button class="btn btn-link shortBtn" (click)="shortIcon('3')" [class.shortBtnActive]='shortBtnIndex == 3' type="button" style="margin:0;padding:0;height:28px;border-radius:0!important;text-decoration: none;">30天</button>
									</div>
									<!-- 柱形图 -->
									<div id="columnChart" class="columnChart" style="height:500px"></div>
								</div>
								<div class="right-pie" style="height:500px;width:30%;">
									<!-- 饼图 -->
									<div id="pieChart" class="pieChart" style="height:320px;"></div>
									<!-- 提示框 -->
									<div class="textBox" style="height:180px;">
										<p class="textTitle" *ngIf="totalNumber"><span class="textLeft">总订单	</span> <span id="normal" class="totalNumber bold">{{totalNumber}}</span></p>
										<p class="textTitle" *ngIf="allMapNormal"><span class="textLeft">正常卸货	</span> <span id="normal" class="normal bold">{{allMapNormal}}</span></p>
										<p class="textTitle" *ngIf="allMapAbnormal"><span class="textLeft">异常卸货	</span> <span id="abnormal" class="abnormal bold">{{allMapAbnormal}}</span></p>
										<p class="textTitle" *ngIf="allMapNorail"><span class="textLeft">未配置围栏  </span> <span id="norail" class="norail bold">{{allMapNorail}}</span></p>
										<p class="textTitle" *ngIf="allMapError"><span class="textLeft">设备异常	</span> <span id="error" class="error bold">{{allMapError}}</span></p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</sa-widgets-grid>
</div>